    :root { --teamy-navy: #057db0; --teamy-orange: #fb7633; --teamy-bg: #f5f7fb; --teamy-border: #eaedf2; --label-black: #1a1a1a; --text-muted: #64748b;}
    .teamy-body-wrapper {font-family: 'Public Sans', sans-serif; padding: 20px; }
    .teamy-top-header { background: var(--teamy-navy); border-radius: 12px; padding: 30px 40px; color: white; margin-bottom: 25px; display: flex; justify-content: space-between; align-items: center; }
    .header-info-row { display: flex; gap: 25px; margin-top: 15px; font-size: 13px; opacity: 0.9; }
    .status-badge { background: #fb8233; padding: 2px 10px; border-radius: 20px; font-size: 11px; font-weight: 700; }
    .circle-progress-wrapper { position: relative; width: 70px; height: 70px; }
    .circle-progress-svg { transform: rotate(-90deg); width: 70px; height: 70px; }
    .circle-bg { fill: none; stroke: rgba(255,255,255,0.2); stroke-width: 6; }
    .circle-bar { fill: none; stroke: var(--teamy-orange); stroke-width: 6; stroke-dasharray: 220; stroke-dashoffset: 33; stroke-linecap: round; transition: stroke-dashoffset 0.5s ease; }
    .circle-percent { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 14px; font-weight: 800; }
    .section-title-wrapper { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
    .section-icon { width: 35px; height: 35px; background: #e0f2fe; color: var(--teamy-navy); display: flex; align-items: center; justify-content: center; border-radius: 8px; font-size: 16px; }
    .section-heading-text h4 { margin: 0; font-size: 18px; font-weight: 700; color: #1e293b; }
    .section-divider { height: 1px; background: var(--teamy-border); margin-bottom: 25px; }
    .teamy-main-card { background: white; border-radius: 15px; border: 1px solid var(--teamy-border); padding: 30px; margin-bottom: 25px; }
    .teamy-label { color: var(--label-black); font-size: 12px; font-weight: 700; text-transform: uppercase; margin-bottom: 8px; display: block; }
    .teamy-input-field { background-color: #f8fafc !important; border: 1px solid #dce4ec !important; border-radius: 8px; padding: 10px 15px; font-size: 14px; width: 100%; }
    .logo-container { display: flex; gap: 20px; align-items: center; margin-bottom: 25px; }
    .logo-img-box { width: 100px; height: 100px; border: 1px solid var(--teamy-border); border-radius: 12px; overflow: hidden; background: #f1f5f9; display: flex; align-items: center; justify-content: center; }
    .logo-img-box img { width: 100%; height: 100%; object-fit: cover; }
    .weekend-group { display: flex; gap: 8px; flex-wrap: wrap; }
    .weekend-checkbox { display: none; }
    .weekend-label { padding: 10px 18px; border: 1px solid var(--teamy-border); border-radius: 8px; cursor: pointer; font-weight: 700; font-size: 12px; transition: 0.3s; background: white; }
    .weekend-checkbox:checked + .weekend-label { background-color: var(--teamy-orange) !important; color: white !important; border-color: var(--teamy-orange) !important; }
    .terms-wrapper { background: #fffcf9; border: 1px solid #ffe4d5; padding: 15px; border-radius: 10px; display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
    .footer-action-bar { display: flex; justify-content: space-between; align-items: center; background: white; padding: 20px 30px; border-radius: 12px; border: 1px solid var(--teamy-border); }
    .btn-update { background: var(--teamy-orange); color: white; padding: 12px 30px; border: none; border-radius: 8px; font-weight: 700; cursor: pointer; }
    .iti { width: 100%; }
    .btn-update-back{background: var(--teamy-orange); color: #ffffff; padding: 6px 10px;border: none; border-radius: 8px;cursor: pointer;}
    .swal2-icon.swal2-warning {border-color: #fb8233;color: #fb8233;}
    button.swal2-confirm.swal2-styled.swal2-default-outline {background-color: #057db0 !important;}
    
    /*D:\laragon\www\teamiy\resources\views\admin\branch\create.blade.php code*/
    .branch-footer-actions {display:flex; justify-content:flex-end; align-items:center; gap:12px; margin-top:25px;}
    .branch-back-btn {background:#f3f4f6; border:1px solid #e5e7eb; padding:8px 18px; border-radius:8px; font-weight:600; color:#444; transition:0.2s;}
    .branch-back-btn:hover { background:#e5e7eb;}
    a.branch-back-btn:hover{color: #057db0;border-color: #057db0;}
    .branch-create-btn {background: var(--teamy-orange); color: white; padding: 12px 30px; border: none; border-radius: 8px; font-weight: 700; cursor: pointer;}
    .branch-create-btn:hover {transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,0.12);}
    /*D:\laragon\www\teamiy\resources\views\admin\branch\create.blade.php code end*/

    /*D:\laragon\www\teamiy\resources\views\admin\section\sidebar.blade.php code*/
    .sidebar {background-color: #057db0 !important; border-right: none !important; display: flex; flex-direction: column;}
    .sidebar .sidebar-header {background-color: #057db0 !important; display: flex; align-items: center; padding: 0 15px; border-bottom: none !important;}
    .sidebar .sidebar-body {background-color: #057db0 !important; flex: 1; overflow-y: auto; padding: 10px 0 !important;}
    .sidebar .sidebar-body .nav {flex-direction: column; padding: 0;}
    .nav-header-label {font-size: 12px; color: rgba(255, 255, 255, 50%); text-transform: uppercase; padding: 15px 0px 8px 20px; display: block;}
    .sidebar .sidebar-body .nav .nav-item {position: relative;}
    .sidebar .sidebar-body .nav .nav-item .nav-link {color: rgba(255, 255, 255) !important; padding: 0px 18px !important; display: flex; align-items: center; transition: all 0.2s ease;}
    .sidebar .sidebar-body .nav .nav-item.active .nav-link, .sidebar .sidebar-body .nav .nav-item .nav-link:hover {color: #ffffff !important;}
    .sidebar .sidebar-body .nav .nav-item .nav-link .link-icon {width: 18px; margin-right: 15px; color: inherit !important; opacity: 0.8;}
    .sidebar-user-footer {padding: 20px 15px;}
    .user-card-small {background: rgba(255, 255, 255, 0.08); border-radius: 12px; padding: 12px; display: flex; align-items: center; gap: 12px;}
    .user-avatar-rect {width: 40px; height: 40px; background-color: #fb8233; color: white; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 16px; flex-shrink: 0;}
    .user-info-text {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
    .user-info-text .u-name {display: block; color: #ffffff; font-size: 13.5px; font-weight: 600;}
    .user-info-text .u-role {display: block; color: rgba(255, 255, 255, 0.5); font-size: 11px;}
    .store-badge-section {padding: 20px 15px; display: flex; flex-direction: column;}
    .svg-store-icon { width: 20px; height: 20px; fill: white; }
    .user-info-text .u-name { display: block; color: #ffffff; font-size: 13.5px; font-weight: 600; }
    .user-info-text .u-role { display: block; color: rgba(255, 255, 255, 0.5); font-size: 11px; }
    /*D:\laragon\www\teamiy\resources\views\admin\section\sidebar.blade.php code End*/

    /*D:laragon\www\teamiy\resources\views\admin\branch\index.blade.php code*/
    .content-wrapper{background:#f9fbff!important}
    .page-header-minimal{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;padding:10px 5px}
    .page-header-minimal h3{font-weight:600;color:#334155;margin:0;font-size:1.4rem}
    .filter-section{background:#fff;border-radius:12px;padding:20px;margin-bottom:25px;border:1px solid #edf2f7}
    .filter-section .form-control,.filter-section .form-select{border:1px solid #e2e8f0;border-radius:8px;height:42px;font-size:13px;color:#64748b}
    .table-container-modern{background:#fff;border-radius:12px;border:1px solid #edf2f7;overflow:hidden}
    .custom-table{margin-bottom:0}
    .custom-table thead th{background:#f8fafc;color:#057db0; font-weight:600;text-transform:uppercase;font-size:12px;letter-spacing:.5px;padding:15px 20px;border-bottom:1px solid #edf2f7}
    .custom-table tbody td{padding:15px 20px;vertical-align:middle;font-size:14px;color:#475569;border-bottom:1px solid #f8fafc}
    .branch-name-text{color:#057db0;font-size:14.5px}
    .address-text{font-size:12.5px;color:#94a3b8;font-weight:400}
    .btn-create-new{background:#fb8233;color:#fff;border-radius:8px;padding:8px 12px;font-weight:500;border:none;font-size:14px;display:flex;align-items:center;gap:8px;transition:.3s}
    .btn-create-new:hover{background:#e6762d;color:#fff;transform:translateY(-1px)}
    .switch{position:relative;width:38px;height:20px}
    .slider.round{border-radius:10px;background:#fb8233}
    input:checked+.slider{background:#057db0}
    input:checked+.slider::before{background-color:#e4f2f7}
    .action-btn-item{color:#057db0;transition:.2s;padding:5px}
    .action-btn-item:hover{color:#fb8233}
    .edit-icon-btn:hover{color:#057db0}
    .delete-icon-btn:hover{color:#ef4444}
    .emp-badge{background:#f1f5f9;color:#64748b;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:500}
    /*D:laragon\www\teamiy\resources\views\admin\branch\index.blade.php code end*/

    /*D:\laragon\www\teamiy\resources\views\admin\company\detail.blade.php code*/
    .content-wrapper {background: #f8fafc !important;}
    .profile-header-strip { background: #fff; border-radius: 16px; padding: 25px; margin-bottom: 25px; border: 1px solid #e2e8f0; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);}
    .company-main-info {display: flex; align-items: center; gap: 20px;}
    .company-logo-circle {width: 70px; height: 70px; border-radius: 14px; background: #f1f5f9; display: flex; align-items: center; justify-content: center; overflow: hidden; border: 1px solid #e2e8f0;}
    .info-card-modern {background: #fff; border-radius: 16px; border: 1px solid #e2e8f0; height: 100%; overflow: hidden;}
    .card-header-custom {padding: 18px 25px; background: #fcfdfe; border-bottom: 1px solid #f1f5f9; display: flex; align-items: center; gap: 10px;}
    .card-header-custom h5 {margin: 0; font-size: 15px; font-weight: 700; color: #334155;}
    .info-grid {padding: 25px;}
    .info-item {margin-bottom: 22px; display: flex; align-items: flex-start; gap: 12px;}
    .info-icon {width: 32px; height: 32px; background: rgba(5, 125, 176, 0.06); color: #057db0; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;}
    .info-content label {display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; color: #94a3b8; margin-bottom: 2px; letter-spacing: 0.5px;}
    .info-content span, .info-content a {display: block; font-size: 14px; color: #1e293b; font-weight: 500;}
    .status-pill-active {background: #dcfce7; color: #15803d; padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600;}
    .day-pill {background: #fef3c7; color: #92400e; padding: 2px 10px; border-radius: 6px; font-size: 12px; font-weight: 600; margin-right: 4px; }
    .btn-edit-glow {background: #fb8233; color: #fff; border: none; padding: 10px 22px; border-radius: 10px; font-weight: 600; box-shadow: 0 4px 14px 0 rgba(251, 130, 51, 0.39); transition: 0.3s;}
    .btn-edit-glow:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(251, 130, 51, 0.23); color: #fff; }
    /*D:\laragon\www\teamiy\resources\views\admin\company\detail.blade.php code End*/

    /*D:\laragon\www\teamiy\resources\views\admin\employees\index.blade.php code*/
    .btn-theme-blue { background-color: #057db0 !important; color: #fff !important; border: none; }
    .btn-theme-orange { background-color: #fb8233 !important; color: #fff !important; border: none; }
    .text-theme-blue { color: #057db0 !important; }
    .text-theme-orange { color: #fb8233 !important; }
    .badge-soft-blue { background-color: rgba(5, 125, 176, 0.1); color: #057db0; border: 1px solid rgba(5, 125, 176, 0.2); }
    .switch input:checked + .slider { background-color: #057db0; }
    /*D:\laragon\www\teamiy\resources\views\admin\employees\index.blade.php code end*/

    /*D:\laragon\www\teamiy\resources\views\admin\employees\show2.blade.php code*/
    .detail-header-wrapper {display: flex;justify-content: space-between;align-items: flex-start;margin-bottom: 25px;flex-wrap: wrap;gap: 15px;}
    .header-text-box h3 {color:#313131;font-weight: 600;margin-bottom: 3px;font-size: 24px;}
    .header-text-box p {color: #64748b;font-size: 14px;margin: 0;}
    .action-btn-group { display: flex; gap: 10px; }
    .btn-custom {padding: 9px 18px;border-radius: 8px;font-weight: 700;font-size: 13px;text-transform: uppercase;letter-spacing: 0.5px;display: inline-flex;align-items: center;gap: 8px;transition: all 0.2s ease-in-out;border: none;box-shadow: 0 4px 6px rgba(0,0,0,0.08);}
    .btn-edit-main { background-color: #fb8233; color: #fff; }
    .btn-edit-main:hover { background-color: #e6762a; color: #fff; transform: translateY(-2px); }
    .btn-back-main { background-color: #057db0; color: #fff; }
    .btn-back-main:hover { background-color: #046691; color: #fff; transform: translateY(-2px); }
    .profile-banner-top {background: #057db0;padding: 35px 25px;border-radius: 12px;color: #ffffff;margin-bottom: 25px;box-shadow: 0 10px 15px -3px rgba(5, 125, 176, 0.2);}
    .profile-avatar-circle {width: 110px;height: 110px;object-fit: cover;border: 4px solid #fb8233;box-shadow: 0 4px 12px rgba(0,0,0,0.15);}
    .info-card-modern {background: #fff;border: 1px solid #e2e8f0;border-radius: 12px;height: 100%;overflow: hidden;box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);}
    .info-card-modern .card-header {background-color: #f8fafc;border-bottom: 1px solid #e2e8f0;padding: 18px 22px;}
    .info-card-modern .card-title {font-weight: 800;color: #fb8233;margin: 0;font-size: 13px;text-transform: uppercase;letter-spacing: 1px;}
    .detail-item-row {display: flex;align-items: center;border-bottom: 1px solid #f1f5f9;padding: 15px 22px;transition: background 0.2s;}
    .detail-item-row:hover { background: #fcfdfe; }
    .detail-item-row:last-child { border-bottom: none; }
    .detail-split-col { width: 50%; display: flex; flex-direction: column; }
    .detail-split-col:first-child { border-right: 1px solid #f1f5f9; padding-right: 15px; }
    .detail-split-col:last-child { padding-left: 15px; }
    .label-muted {font-size: 12px;font-weight: 500;color: #057db0;margin-bottom: 3px;}
    .value-dark {color: #454545;font-size: 14px;font-weight: 500;margin-left: 10px;}
    /*D:\laragon\www\teamiy\resources\views\admin\employees\show2.blade.php code end*/

    /*D:\laragon\www\teamiy\resources\views\admin\branch\index.blade.php Code*/
    .btn-premium-add {background: #fb8233;color: white;border: none;padding: 10px 18px;border-radius: 14px;display: flex;align-items: center;gap: 5px;box-shadow: 0 10px 25px rgba(5, 125, 176, 0.2);transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);}
    .btn-premium-add:hover { transform: translateY(-3px); box-shadow: 0 15px 30px rgba(5, 125, 176, 0.3); }
    .glass-filter-panel {background: rgba(255, 255, 255, 0.8);backdrop-filter: blur(10px);padding: 25px;border-radius: 20px;border: 1px solid var(--soft-white);box-shadow: 0 4px 15px rgba(0,0,0,0.03);}
    .modern-search-box { position: relative; }
    .modern-search-box i { position: absolute; left: 15px; top: 14px; color: #94a3b8; width: 20px; }
    .modern-search-box input { height: 50px; padding-left: 50px; border-radius: 12px; border: 1px solid #e2e8f0; background: #fff; }
    .modern-select { height: 50px; border-radius: 12px; font-weight: 600; color: #475569; }
    .btn-theme-primary { background: var(--navy-theme); color: white; border: none; height: 50px; border-radius: 12px; font-weight: 700; transition: 0.3s; }
    .btn-theme-outline { background: white; color: #475569; border: 1px solid #e2e8f0; height: 50px; border-radius: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; transition: 0.3s; }
    .branch-master-card {background: white;border-radius: 15px;overflow: hidden;border: 1px solid #e2e8f0;transition: 0.4s all ease;height: 100%;display: flex;flex-direction: column;}
    .branch-master-card:hover {box-shadow: 0 25px 50px -12px rgba(5, 125, 176, 0.15);border-color: #fb8233;}
    .card-glossy-header {background: linear-gradient(13deg, #057db0 0%, #057db0 100%);padding: 15px;color: white;position: relative;}
    .header-overlay {position: absolute; top: 0; left: 0; right: 0; bottom: 0;background: radial-gradient(circle at top right, rgba(255,255,255,0.15), transparent);}
    .branch-icon-square {width: 38px; height: 38px; background: rgba(255,255,255,0.2);backdrop-filter: blur(8px); border-radius: 12px;display: flex; align-items: center; justify-content: center;}
    .branch-name-display {font-size: 22px; margin: 15px 0 5px; position: relative; z-index: 2;}
    .branch-ref-pill { font-size: 11px; background: rgba(0,0,0,0.2); padding: 4px 10px; border-radius: 6px;}
    .card-white-body { padding: 20px; flex-grow: 1; display: flex; flex-direction: column; }
    .info-item-box { display: flex; gap: 10px; margin-bottom: 15px; }
    .icon-circle { color: #fb8233; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .icon-circle:before{content: none;}
    .icon-circle svg { width: 14px; }
    .text-content small { display: block; font-size: 10px; font-weight: 800; color: #94a3b8; letter-spacing: 1px; }
    .text-content p {font-size: 14px; font-weight: 500; color: #065e83; line-height: 1.4; }
    .stats-footer-box { margin-top: auto; padding-top: 15px; border-top: 1px solid #f1f5f9; }
    .emp-group { display: flex; align-items: center; gap: 10px; }
    .avatar-stack { width: 32px; height: 32px; background: #f8fafc; border-radius: 8px; display: flex; align-items: center; justify-content: center; color: #fb8233; border: 1px solid #e2e8f0; }
    .emp-label { font-size: 13px; font-weight: 700; color: #475569; }
    .action-dock { display: flex; gap: 8px; }
    .btn-action { width: 32px; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; transition: 0.3s; border: none; }
    .btn-action.edit { background: #e0f2fe; color:#057db0; }
    .btn-action.delete { background: #fff1f2; color: #fb8233; }
    .btn-action:hover { transform: scale(1.1); filter: brightness(0.95); }
    .switch-modern { position: relative; display: inline-block; width: 44px; height: 24px; }
    .switch-modern input { opacity: 0; width: 0; height: 0; }
    .slider-modern { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(255,255,255,0.3); transition: .4s; border-radius: 34px; }
    .slider-modern:before { position: absolute; content: ""; height: 18px; width: 18px; left: 3px; bottom: 3px; background-color: white; transition: .4s; border-radius: 50%; }
    input:checked + .slider-modern { background-color: #fb8233; }
    input:checked + .slider-modern:before { transform: translateX(20px); }
    svg.feather.feather-users, svg.feather.feather-edit-3, svg.feather.feather-trash-2{width: 14px;}
    /*D:\laragon\www\teamiy\resources\views\admin\branch\index.blade.php Code End*/

    /*D:\laragon\www\teamiy\resources\views\admin\employees\index.blade.php Code*/
    .btn-teamiy-add-new { background: #fb8233; color: white; padding: 10px 20px; border-radius: 10px; font-weight: 700; font-size: 14px; box-shadow: 0 4px 12px rgba(251, 130, 51, 0.25); transition: 0.3s; }
    .btn-teamiy-add-new:hover { background: #e3722a; color: white; transform: translateY(-2px); }
    .filter-panel-teamiy { background: white; border-radius: 12px; border: 1px solid #f1f5f9; }
    .search-container-teamiy { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 6px 12px; display: flex; align-items: center; }
    .search-container-teamiy i { width: 16px; color: #94a3b8; margin-right: 8px; }
    .search-container-teamiy input { border: none; background: transparent; outline: none; font-size: 13px; font-weight: 500; }
    .select-teamiy-custom { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 6px 10px; font-size: 13px; font-weight: 600; color: #4a5568; outline: none; }
    .btn-utility-teamiy { background: white; border: 1px solid #e2e8f0; border-radius: 8px; padding: 8px 15px; font-size: 12px; font-weight: 700; display: flex; align-items: center; gap: 6px; color: #1a202c; }
    .card-teamiy-main { background: white; border-radius: 16px; overflow: hidden; border: 1px solid #f1f5f9; transition: 0.3s ease; height: 100%; display: flex; flex-direction: column; }
    .card-teamiy-main:hover { transform: translateY(-8px); box-shadow: 0 15px 30px rgba(0,0,0,0.08) !important; }
    .avatar-circle-teamiy { width: 80px; height: 80px; border-radius: 50%; border: 3px solid #fb8233; padding: 3px; }
    .avatar-circle-teamiy img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
    .contact-pill-teamiy { background: #fcfcfc; border: 1px solid #f1f5f9; border-radius: 30px; padding: 5px 12px; font-size: 11px; color: #4a5568; font-weight: 600; display: flex; align-items: center; gap: 6px; }
    .status-label-small { font-size: 11px; font-weight: 800; color: #64748b; text-transform: uppercase; }
    .view-details-link { color: #111827; font-size: 12px; transition: 0.2s; }
    .view-details-link:hover { color: #fb8233; }
    .switch-mini { position: relative; display: inline-block; width: 28px; height: 16px; }
    .switch-mini input { opacity: 0; width: 0; height: 0; }
    .slider-mini { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #e2e8f0; transition: .4s; border-radius: 34px; }
    .slider-mini:before { position: absolute; content: ""; height: 12px; width: 12px; left: 2px; bottom: 2px; background-color: white; transition: .4s; border-radius: 50%; }
    input:checked + .slider-mini { background-color: #fb8233; }
    input:checked + .slider-mini:before { transform: translateX(12px); }
    .stats-container-teamiy {display: flex;gap: 20px;margin-bottom: 30px;flex-wrap: wrap;}
    .stat-card-new {background: #ffffff;border-radius: 12px;padding: 20px;flex: 1;min-width: 300px;border: 1px solid #e2e8f0;box-shadow: 0 2px 4px rgba(0,0,0,0.02);}
    .stat-header {display: flex;align-items: center;gap: 8px;color: #64748b;font-weight: 700;font-size: 14px;margin-bottom: 10px;}
    .stat-main-row {display: flex;align-items: baseline;gap: 10px;margin-bottom: 5px;}
    .stat-number {font-size: 28px;font-weight: 800;color: #111827;}
    .stat-badge {background: #ecfdf5;color: #10b981;padding: 2px 8px;border-radius: 6px;font-size: 12px;font-weight: 700;}
    .stat-subtext {color: #94a3b8;font-size: 12px;margin-bottom: 20px;display: block;}
    .prog-row { margin-bottom: 10px; }
    .prog-labels {display: flex;justify-content: space-between;font-size: 11px;font-weight: 700;margin-bottom: 4px;}
    .prog-bar-bg {height: 10px;background: #f1f5f9;border-radius: 10px;}
    .prog-fill { height: 100%; border-radius: 10px; }
    .gender-grid-new {display: flex;gap: 15px;margin-bottom: 15px;}
    .gender-item {flex: 1;padding: 12px;border: 1px solid #f1f5f9;border-radius: 10px;text-align: center;}
    .gender-label { font-size: 10px; color: #64748b; font-weight: 700; text-transform: uppercase; }
    .gender-val { font-size: 20px; font-weight: 800; color: #111827; display: block; }
    .gender-counts-flex {display: flex;gap: 10px;}
    .gender-pill-new {flex: 1;padding: 10px;border-radius: 8px;font-size: 12px;font-weight: 700;text-align: center;}
    /*D:\laragon\www\teamiy\resources\views\admin\employees\index.blade.php Code End*/

    /*D:\laragon\www\Teamiy-UI\resources\views\admin\section\nav.blade.php Code*/
    .navbar .search-form {flex: 1;max-width: 500px;margin-left: 20px;}
    .navbar .search-form .input-group {background: #f1f5f9; /* Light grey background from image */border-radius: 12px; /* Smooth rounded corners */border: 1px solid #e2e8f0;padding: 2px 12px;transition: all 0.3s ease;}
    .navbar .search-form .input-group:focus-within {background: #ffffff;border-color: #057db0;box-shadow: 0 0 0 3px rgba(5, 125, 176, 0.1);}
    .navbar .search-form .form-control {background: transparent;border: none;height: 40px;font-size: 14px;color: #475569;}
    .navbar .search-form .input-group-text {background: transparent;border: none;color: #94a3b8;}
    .notification-sidebar {position: fixed;top: 0;right: -420px; width: 400px;height: 100vh;background: #ffffff;z-index: 9999;box-shadow: -10px 0 30px rgba(0,0,0,0.1);transition: right 0.4s cubic-bezier(0.05, 0.74, 0.2, 0.99);display: flex;flex-direction: column;}
    .notification-sidebar.active { right: 0; }
    .notif-overlay { position: fixed;top: 0;left: 0; width: 100%;height: 100%;background: rgba(15, 23, 42, 0.4);backdrop-filter: blur(2px);z-index: 9998;display: none; }
    .notif-overlay.active { display: block; }
    .notif-tabs-header {display: flex;padding: 10px 20px;gap: 20px;border-bottom: 1px solid #f1f5f9;}
    .notif-tab-item {font-size: 14px;font-weight: 600;color: #057db0;padding: 8px 0;cursor: pointer;position: relative;}
    .notif-tab-item.active { color: #fb8233; }
    .notif-tab-item.active::after {content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 3px;background: #fb8233;border-radius: 10px;}
    .notif-item {padding: 15px 20px;border-bottom: 1px solid #f8fafc;display: flex;gap: 12px;transition: background 0.2s;}
    .notif-item:hover { background: #f8fafc; }
    .notif-icon-box {width: 40px; height: 40px; border-radius: 50%;display: flex; align-items: center; justify-content: center; flex-shrink: 0;}
    .notif-msg { font-size: 13px; line-height: 1.5; color: #334155; margin-bottom: 4px; }
    .notif-meta { font-size: 11px; color: #94a3b8; font-weight: 500; }
    .btn-notif-action {padding: 6px 16px; border-radius: 8px; font-size: 12px; font-weight: 600;border: 1px solid #e2e8f0; margin-top: 8px; cursor: pointer;}
    .btn-approve { background: #057db0; color: white; border: none; margin-left: 8px; }
    .navbar-nav .nav-link i { color: #64748b; width: 20px; }
    a#openNotif,a#langDropdown{background-color: #ffffff38;padding: 12px;border-radius: 15px;color:#fff}
    a#openNotif:hover {color: #fb8233;}
    img.wd-35.ht-35.rounded-circle.border {border: 2px solid #fb8233 !important;}
    .navbar .search-form .input-group{background: #f1f5f91f;border-radius: 12px;border:none;}
    span.input-group-text {background-color: #ffffff00 !important;color: #fff !important;border-right: 1px solid #ffffff66 !important;}
    .navbar .search-form .input-group:focus-within {background: #ffffff4f !important;}
    .navbar .search-form .form-control {color: #ffffff !important;}
    .p-4.d-flex.justify-content-between.align-items-center.border-bottom {background-color: #057db0;color: #fff;}
    svg.feather.feather-x {color: #fff;}
    .notif-footer {padding: 15px;border-top: 1px solid #f1f5f9;background: #fff;}
    .btn-view-all {display: block;width: 100%;padding: 10px;background: #f8fafc;color: #fb8233;text-align: center;border-radius: 8px;font-weight: 700;font-size: 13px;text-decoration: none;transition: background 0.2s;}
    .btn-view-all:hover {background: #e2e8f0;color: #0056b3;}
    /*D:\laragon\www\Teamiy-UI\resources\views\admin\section\nav.blade.php Code End*/

    /*D:\laragon\www\Teamiy-UI\resources\views\admin\dashboard.blade.php Code*/
    .stat-card {background: #fff;border: none;border-radius: 12px;padding: 18px;position: relative;box-shadow: 0 2px 15px rgba(0,0,0,0.03);}
    .stat-header { display: flex; justify-content: space-between; align-items: flex-start; }
    .stat-icon-box { background: #f8fafc; padding: 8px; border-radius: 8px; border: 1px solid #edf2f7; }
    .stat-label { font-size: 13px; font-weight: 700; color: #1e293b; margin-top: 12px; }
    .stat-subtext { font-size: 10px; color: #64748b; margin-bottom: 8px; display: block; }
    .stat-value { font-size: 26px; font-weight: 800; color: #1e293b; }
    .stat-badge { font-size: 10px; padding: 2px 8px; border-radius: 4px; font-weight: 700; }
    .badge-orange { background: #fff1eb; color: #ff7e42; }
    .badge-red { background: #fee2e2; color: #ef4444; }
    .btn-details-orange { background: #ff7e42; color: #fff; border: none; border-radius: 8px; font-size: 10px; padding: 4px 12px; font-weight: 600;}
    .section-card { background: #fff; border-radius: 16px; margin-top: 25px; border: 1px solid #eef2f6; }
    .section-header { padding: 20px 25px; border-bottom: 1px solid #f1f5f9; display: flex; justify-content: space-between; align-items: center; }
    .table thead th { background: #f8fafc; color: #1e293b; font-size: 13px; font-weight: 700; border: none; padding: 15px 25px; }
    .table td { padding: 15px 25px; vertical-align: middle; border-top: 1px solid #f8fafc; font-size: 13px; }
    .project-avatar { width: 35px; height: 35px; border-radius: 50%; background: #ff7e42; display: flex; align-items: center; justify-content: center; color: white; font-weight: bold; }
    .member-group img { width: 28px; height: 28px; border-radius: 50%; border: 2px solid #fff; margin-left: -8px; }
    .member-count { width: 28px; height: 28px; border-radius: 50%; background: #f1f5f9; font-size: 10px; display: flex; align-items: center; justify-content: center; margin-left: -8px; border: 2px solid #fff; }
    .pg-bar { height: 6px; background: #e2e8f0; border-radius: 10px; width: 120px; overflow: hidden; }
    .pg-fill { height: 100%; border-radius: 10px; }
    .bg-green { background: #22c55e; }
    .bg-gray { background: #cbd5e1; }
    .nav-pills-custom { background: #f1f5f9; padding: 4px; border-radius: 10px; display: inline-flex; }
    .nav-pills-custom .nav-link { border: none; color: #64748b; padding: 6px 20px; border-radius: 8px; font-size: 12px; font-weight: 700; transition: 0.3s;}
    .nav-pills-custom .nav-link.active { background: #ff7e42 !important; color: #fff !important; }
    .status-pill { padding: 4px 12px; border-radius: 20px; font-size: 11px; font-weight: 700; }
    .sp-approved { background: #dcfce7; color: #15803d; }
    .sp-pending { background: #f1f5f9; color: #64748b; }
    .sp-rejected { background: #fee2e2; color: #b91c1c; }
    i.fas.fa-users.text-dark.small::before{color:#057db0;}
    span.stat-badge.badge-orange {background: #fb823326; color: #fb8233;}
    /*D:\laragon\www\Teamiy-UI\resources\views\admin\dashboard.blade.php Code End*/
    
    /*D:\laragon\www\Teamiy-UI\resources\views\admin\payroll\employeeSalary\payroll.blade.php Code*/
    .glass-panel {background: rgba(255, 255, 255, 0.7);backdrop-filter: blur(10px);border-radius: 20px;padding: 25px;border: 1px solid rgba(255, 255, 255, 0.3);box-shadow: 0 8px 32px rgba(31, 38, 135, 0.07);}
    .modern-select {height: 48px;border-radius: 12px;border: 1px solid #e2e8f0;font-weight: 500;}
    .btn-premium {background: #057db0;color: #fff;height: 48px;border-radius: 12px;font-weight: 600;border: none;padding: 0 25px;transition: all 0.3s ease;}
    .payroll-card {background: #fff;border-radius: 20px;border: 1px solid #f1f5f9;transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);height: 100%;overflow: hidden;position: relative;}
    .payroll-card:hover {transform: translateY(-10px);box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.05);}
    .card-top-header {padding: 20px;background: #057db0;border-bottom: 1px solid #f1f5f9;}
    .card-id {position: absolute;top: 6px;right: 15px;font-size: 11px;font-weight: 800;color: #ffffff;}
    .status-badge {padding: 6px 12px;border-radius: 10px;font-size: 10px;font-weight: 700;text-transform: uppercase;}
    .status-pending { background: #f1f5f9; color: #64748b; }
    .status-paid { background: #f0fdf4; color: #fb8233; }
    .emp-name {color: #fff;font-weight: 700;margin: 12px 0 5px;font-size: 18px;display: block;}
    .salary-val {font-size: 18px;color: #fff;}
    .body-content { padding: 20px; }
    .info-item {display: flex;align-items: center;gap: 12px;margin-bottom: 12px;}
    .icon-box {width: 32px;height: 32px;background: #f1f5f9;border-radius: 8px;display: flex;align-items: center;justify-content: center;color: #057db0;}
    .icon-box:before {content: "";}
    .info-box small {display: block;color: #94a3b8;font-size: 10px;font-weight: 700;text-transform: uppercase;}
    .info-box p {margin: 0;font-size: 13px;color: #475569;font-weight: 600;}
    .action-row {display: flex;gap: 10px;margin-top: 20px;padding-top: 15px;border-top: 1px solid #f1f5f9;}
    .btn-act {flex: 1; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center;font-weight: 600;font-size: 12px; text-decoration: none; border: none;}
    .btn-view-style { background: #eff6ff; color: #057db0; }
    .btn-pay-style { background: #057db0; color: #fff; }
    /*D:\laragon\www\Teamiy-UI\resources\views\admin\payroll\employeeSalary\payroll.blade.php Code End*/

    /*D:\laragon\www\Teamiy-UI\resources\views\admin\attendance\index.blade.php Code*/
    .attendance-grid {display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.5rem;}
    .clean-card {background: #ffffff; border-radius: 20px; padding: 24px;border: 1px solid #f3f4f6; transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);position: relative; overflow: hidden;}
    .clean-card:hover { transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgba(0,0,0,0.05); }
    .card-top { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
    .avatar-lite {width: 44px; height: 44px; border-radius: 12px;background: #eff6ff; color: #057db0;display: flex; align-items: center; justify-content: center;font-weight: 800; font-size: 16px;}
    .user-name { font-weight: 700; color: #057db0; font-size: 15px; margin: 0; }
    .user-id { font-size: 11px; color: #6b7280; font-weight: 600; }
    .time-row { display: flex; justify-content: space-between; margin-bottom: 20px; }
    .time-item { flex: 1; }
    .time-item small { font-size: 10px; font-weight: 700; color: #6b7280; text-transform: uppercase; letter-spacing: 0.5px; }
    .time-val { font-size: 14px; font-weight: 700; color: #057db0; display: block; }
    .status-dot {position: absolute; top: 24px; right: 24px; font-size: 10px;font-weight: 800; padding: 4px 10px; border-radius: 8px;    background-color: #057db01c;}
    .status-1 { background: #fb823317; color: #fb8233; }
    .status-0 { background: #fffbeb; color: #d97706; }
    .actions-lite {display: flex; justify-content: flex-end; gap: 8px;border-top: 1px solid #f9fafb; padding-top: 16px;}
    .btn-icon-lite {width: 36px; height: 36px; border-radius: 10px; border: none;background: #f9fafb; color: #fb8233; display: flex;align-items: center; justify-content: center; transition: 0.2s;}
    .btn-icon-lite:hover { background: #057db0; color: #fff; }
    .btn-delete-lite:hover { background: #fee2e2; color: #ef4444; }
    .worked-pill {background: #f8fafc; color: #057db0; padding: 4px 10px;border-radius: 8px; font-size: 12px; font-weight: 800;}
    .btn-action-primary {background: #057db0; color: white; border: none;border-radius: 10px; padding: 8px 16px; font-weight: 700; font-size: 12px;}
    a.btn.btn-outline-danger.btn-sm.rounded-3.fw-bold.px-3 {color: #fb8233;border-color: #fb8233;}
    a.btn.btn-outline-danger.btn-sm.rounded-3.fw-bold.px-3:hover {background: #057db0; color: white;border-color:#057db0}
    span.time-val.text-success {color: #fb8233 !important;}
    /*D:\laragon\www\Teamiy-UI\resources\views\admin\attendance\index.blade.php Code End*/

    /*D:\laragon\www\Teamiy-UI\resources\views\admin\attendance\show.blade.php Code*/
    .stat-pill {background: white;border-radius: 15px;padding: 15px 20px;box-shadow: 0 4px 6px rgba(0,0,0,0.02);border: 1px solid #edf2f7;}
    .stat-pill.new-wi {width: 80%;justify-items: center;justify-self: center;background-color: #fb82332e;}
    .stat-label { font-size: 16px; text-transform: uppercase; color: #057db0; font-weight: 700; }
    .stat-value { font-size: 18px; font-weight: 800; color: #1e293b; }
    .attendance-grid {display: grid;grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));gap: 20px;margin-top: 25px;}
    .clean-card {background: white;border-radius: 20px;padding: 20px;position: relative;border: 1px solid #edf2f7;transition: all 0.3s ease;box-shadow: 0 10px 15px -3px rgba(0,0,0,0.04);}
    .clean-card:hover { transform: translateY(-5px); box-shadow: 0 20px 25px -5px rgba(0,0,0,0.08); }
    .status-badge {top: 20px;right: 20px;font-size: 10px;padding: 4px 12px;border-radius: 20px;font-weight: 700;text-transform: uppercase;}
    .date-circle {width: 50px;height: 50px;background: #e0f2fe;color: #0369a1;border-radius: 12px;display: flex;align-items: center;justify-content: center;font-weight: 800;font-size: 14px;flex-direction: column;line-height: 1.2;}
    .time-container {display: flex;justify-content: space-between;background: #f8fafc;border-radius: 12px;padding: 12px;margin: 15px 0;}
    .time-box small { display: block; font-size: 10px; color: #94a3b8; text-transform: uppercase; }
    .worked-hour-tag {background: #f1f5f9;color: #475569;padding: 4px 12px;border-radius: 8px;font-size: 12px;font-weight: 600;}
    .actions-row {display: flex;gap: 8px;border-top: 1px solid #f1f5f9;padding-top: 15px;margin-top: 5px;}
    .btn-icon-lite {width: 34px;height: 34px;border-radius: 10px;display: flex;align-items: center;justify-content: center;background: #fb823314;color: #fb8233;border: none;transition: 0.2s;}
    .btn-icon-lite:hover { background: #057db0; color: white; }
    .btn-delete-lite:hover { background: #ef4444; color: white; }
    button.btn.btn-sm.btn-outline-primary.rounded-pill.addEmployeeAttendance {color: #fb8233;border-color: #fb8233;}
    p.mb-0.fw-bold {color: #000;}
    /*D:\laragon\www\Teamiy-UI\resources\views\admin\attendance\show.blade.php Code End*/

    /*D:\laragon\www\Teamiy-UI\resources\views\admin\role\index.blade.php code*/
    .role-header-grid {display: grid;grid-template-columns: 80px 1fr 1fr 180px;}
    .role-item-row {background: #fff;border: 1px solid #edf2f9;border-radius: 12px;transition: all 0.2s ease;}
    .role-item-row:hover {transform: translateY(-2px);border-color: #fb8233;box-shadow: 0 5px 15px rgba(0,0,0,0.05);}
    .theme-avatar {width: 38px;height: 38px;background-color: #057db0;color: #fff;display: flex;align-items: center;justify-content: center;border-radius: 10px;font-weight: 700;font-size: 14px;box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);}
    .btn-permission-link {text-decoration: none;color: #057db0;font-size: 12px;font-weight: 600;padding: 6px 12px;border-radius: 6px;background: rgba(var(--bs-primary-rgb), 0.08);transition: 0.2s;}
    .btn-permission-link:hover {background: #fb8233;color: #fff;}
    .btn-white {background: #fff;border: 1px solid #edf2f9;}
    .btn-white:hover {background: #f8f9fa;}
    @media (max-width: 768px) {
    .role-header-grid {grid-template-columns: 1fr;text-align: center;gap: 10px;}
    .text-end { text-align: center !important; }}
    /*D:\laragon\www\Teamiy-UI\resources\views\admin\role\index.blade.php code end*/

     /*D:\laragon\www\Teamiy-UI\resources\views\admin\permission\index.blade.php code*/   
    .permission-grid {display: grid;grid-template-columns: 80px 1fr 150px 150px;}
    .permission-item-row {background: #fff;border: 1px solid #edf2f9;border-radius: 12px;transition: all 0.2s ease;}
    .permission-item-row:hover {transform: translateY(-2px);border-color: #fb8233;box-shadow: 0 5px 15px rgba(0,0,0,0.05);}
    .perm-icon {width: 32px;height: 32px;background: #057db014;color: #057db0;display: flex;align-items: center;justify-content: center;border-radius: 8px;}
    .btn-action-circle {width: 34px;height: 34px;border-radius: 10px;display: inline-flex;align-items: center;justify-content: center;border: none;transition: 0.2s;text-decoration: none;}
    .edit {background: rgba(var(--bs-primary-rgb), 0.08); color: var(--bs-primary); }
    .edit:hover { background: #057db0; color: #fff; }
    .delete {background: #fff5f5; color: #fb8233; }
    .delete:hover {background: #fb8233; color: #fff; }
    .bg-soft-primary {background: rgba(var(--bs-primary-rgb), 0.1); }
    .bg-soft-info {background: #fb823321; }
    .bg-soft-success {background: #e8f5e9; }
    .bg-light-alt {background: #fafbfc; }
    .pagination-modern .pagination {margin-bottom: 0; }
    .pagination-modern .page-link {border-radius: 8px; margin: 0 2px; border: none; font-size: 13px; }
    a.btn-action-circle.edit {color: #057db0;}
    a.btn-action-circle.edit:hover {color: #fff;}
    button.btn-action-circle.delete.deleteRole {color: #fb8233;}
    button.btn-action-circle.delete.deleteRole:hover {color: #fff;}
    span.badge.rounded-pill.bg-soft-info.text-info{color: #fb8233 !important;padding:8px 12px;}
    @media (max-width: 768px) {
    .permission-grid {grid-template-columns: 1fr 1fr; gap: 10px; }
    .permission-grid div:first-child {display: none; }}
    /*D:\laragon\www\Teamiy-UI\resources\views\admin\permission\index.blade.php code end*/


    /*D:\laragon\www\Teamiy-UI\resources\views\admin\notification\index.blade.php code*/
    .filter-card {background: white;border-radius: 15px;border: none;box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05);margin-bottom: 2rem;padding: 20px;}
    .notification-grid {display: grid;grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));gap: 20px;}
    .n-card {background: white;border-radius: 16px;padding: 20px;position: relative;border: 1px solid #edf2f7;transition: all 0.3s ease;display: flex;flex-direction: column;justify-content: space-between;}
    .n-card:hover { transform: translateY(-5px); box-shadow: 0 12px 20px -5px rgba(0,0,0,0.08);border-color: #057db0;}
    .type-pill {font-size: 10px;font-weight: 800;text-transform: uppercase;padding: 4px 12px;border-radius: 20px;background: #057db01f; color: #057db0;letter-spacing: 0.5px;}
    .status-switch {position: absolute;top: 20px;right: 20px;}
    .n-title {font-size: 16px;font-weight: 700;color: #fb8233; margin-top: 15px;margin-bottom: 8px;line-height: 1.4;}
    .n-date {font-size: 12px;color: #94a3b8;display: flex;align-items: center;gap: 5px;}
    .n-footer {margin-top: 20px;padding-top: 15px;border-top: 1px solid #f1f5f9;display: flex;justify-content: space-between;align-items: center;}
    .btn-circle-lite {width: 36px;height: 36px;border-radius: 10px;display: flex;align-items: center;justify-content: center;background: #f8fafc;color: #057db0;border: none;transition: 0.2s;}
    .btn-circle-lite:hover { background: #057db0; color: white; }
    .btn-delete:hover { background: #fb8233; color: white; }
    .switch { position: relative; display: inline-block; width: 34px; height: 20px; }
    .switch input { opacity: 0; width: 0; height: 0; }
    .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #cbd5e1; transition: .4s; border-radius: 34px; }
    .slider:before { position: absolute; content: ""; height: 14px; width: 14px; left: 3px; bottom: 3px; background-color: white; transition: .4s; border-radius: 50%; }
    input:checked + .slider { background-color: #057db0; }
    input:checked + .slider:before { transform: translateX(14px); }
    /*D:\laragon\www\Teamiy-UI\resources\views\admin\notification\index.blade.php code end*/